<script type="text/javascript" src="{$base_dir}js/AJAX_InstantMessage.js"></script>
<script type="text/javascript" src="{$base_dir}js/jquery.scrollable-1.0.2.min.js"></script>
<script type="text/javascript" src="{$base_dir}js/jquery.tooltip.min.js"></script>
{literal}
<script type="text/javascript">
$(document).ready(function(){
	activeMenu('10', '12');
	getMessages('inbox');
	$('#recipients').autocomplete('../InstantMessage/getAllUsernames?set_ajax_view', {
		multiple: true,
		multipleSeparator: ';',
		matchContains: true,
		formatItem: function(data, i, total) {
			// don't show the current usernames
			if (document.getElementById('recipients').value.match(data[0])) 
				return false;
			return data[0];
		}
	});

	$('#replyMsgDialog').dialog({
		autoOpen: false,			
		modal: true,
		width: 700,
		height: 270,
		buttons: {
		{/literal}"{translate}Cancel{/translate}"{literal}: function() { 
				$(this).dialog("close"); 
			},				
		{/literal}"{translate}Reply{/translate}"{literal}: function() {
				sendReplyMessage();
			}							
		}
	});	
});
</script>
{/literal}
<div id='messageNav'>
	{include file="instantmessage/element_select_box.html"}
</div>
<span id='pathInfo' style='display: none'>{$path}</span>
<div id='allMessages'></div>
<div id='messageContent' style='display:none'></div>
<div id='newMessageForm' style='display:none'>
	{include file='instantmessage/general_new_message.html'}
</div>
<div id="replyMsgDialog" title="{translate}REPLY{/translate}" style="display: none;">
	<img id='recipientImg' src='' /><textarea id='replyContent' name='replyContent' style='margin-left: 20px; width: 470px; height: 170px;'></textarea>
	<input type='hidden' id='replyRecipient' name='replyRecipient' value=''/>
	<input type='hidden' id='replyEmergency' name='replyEmergency' value=''/>
	<input type='hidden' id='replyRootId' name='replyRootId' value=''/>
</div>